<template>
  <div class="container">
    <el-container style="height: 800px; border: 2px #eee">
        <el-header style="height:100px">
        <img class="logo" alt="logo" :src="require('./../../assets/logo1.png')"/>
            <div class="avator" style="text-align: right; float:right">
                <div>
                <el-avatar :size="65" src="https://ftp.bmp.ovh/imgs/2021/06/8691b8db5223ac81.jpg"></el-avatar>
                </div>
            </div>
        </el-header>
            <div class="container1" style="background-color: rgb(255,255,255);">
                <el-row type="flex" align="middle" justify="justify">
                    <el-col :offset="1" :span="4">
                        <el-button size="mini" round @click="$router.push({path: '/admin/home'})">
                            <i class="el-icon-arrow-left"/>
                        </el-button>
                    </el-col>
                    <el-col :span="10" :offset="3">
                        <el-menu :default-actice="activeIndex" class="el-menu" mode="horizontal" @select="handleSelect" style="border: hidden"> 
                            <el-menu-item index="1" style="margin-left:60px">编辑</el-menu-item>
                            <el-menu-item index="2" style="margin-left:50px">发布</el-menu-item>
                            <el-menu-item index="3" style="margin-left:50px">统计</el-menu-item>
                        </el-menu>
                    </el-col>
                </el-row>
            </div>

            <el-button class="result" type="success" style="width: 70px; margin-top: 20px; margin-left: 75%;" @click="exportProjectResult">导出</el-button>
          <div class="result-table-view" style="width: 50%; margin-left: 320px;">
            <el-table
                stripe
                @row-dblclick="(row, column, event)=>{
                    this.openDetailDrawerHandle(row)
                }"
                header-cell-class-name="data-table-header"
                :data="projectResultList">
                <el-table-column
                  type="index"
                  label="序号"
                  width="300">
                </el-table-column>
                <el-table-column
                    v-for="col in fixedCustomColumns" :key="`t${col}`"
                    :label="fixedDefaultLabelFormColumn[col]" >
                    <template slot-scope="scope">
                        {{ scope.row[col] }}
                    </template>
                </el-table-column>
            </el-table>
          </div>
    </el-container>
  </div>
</template>

<script>
const fixedDefaultFormColumn = ['createTime']
const fixedDefaultLabelFormColumn = {createTime: '提交时间'}
import {postKeyValueRequest,postRequest,getRequest,getRequest2} from '@/api/api'
export default {
  data() {
    return {
      total:'',
      size:'',
      activeIndex:'2',
      publishStatus: false,
      projectData: null,
      fixedCustomColumns: fixedDefaultFormColumn,
      fixedDefaultLabelFormColumn: fixedDefaultLabelFormColumn,
      projectResultList: []
    }
  },
  mounted() {
    getRequest(`/project/result/all?key=${this.$route.query.key}`).then(resp=>{
        this.projectResultList = resp.data
    })
    getRequest(`/project/getByKey?key=${this.$route.query.key}`).then(resp=>{
        this.projectData = resp.data
    })
  },
  methods:{
    handleSelect(key,keyPath){
        console.log(key)
        var url = window.location.href;
        var keys = url.split('=')[1];
        if(key == 1){
          this.$router.push({path: '/admin/create', query: {key: keys}})
        }else if(key == 2){
          this.$router.push({path: '/admin/publish', query: {key: keys}})
        }else if(key == 3){
          location.reload()
        }
    },
    exportProjectResult(){
      alert("正在导出。。")
      getRequest2(`/project/result/export?key=${this.$route.query.key}`).then(res=>{
        //console.log(res)        
        let blob = res
        let downloadElement = document.createElement('a')
        console.log(blob)
        let href = window.URL.createObjectURL(blob) //创建下载的链接
        downloadElement.href = href
        downloadElement.download = this.projectData.title + this.$dayjs().format('YYYYMMDDHHMM') + '.xls' //下载后文件名
        document.body.appendChild(downloadElement)
        downloadElement.click() //点击下载
        document.body.removeChild(downloadElement) //下载完成移除元素
        window.URL.revokeObjectURL(href) //释放掉blob对象
      })
    },
    openDetailDrawerHandle(row){
        console.log(row)
        // 通过查询id和projectKey查询
        this.$alert('这是row的内容',row, {
          confirmButtonText: '确定',
        })
    },
  }
}
</script>

<style>

</style>